# from ex4nicegui import to_ref, ref_computed
# from ex4nicegui.reactive import rxui
# from nicegui import ui

'''ui.input'''

'''

options = ['AutoComplete', 'NiceGUI', 'Awesome']
自动补全: ui.input(,autocomplete=options,)
不满足条件提示: (以限定20字符为例)
    validation={'Input too long': lambda value: len(value) < 20}

'''
'''props
clearable :添加清除按钮
rounded outlined dense :倒角的包裹线
input-style="color: blue" :输入字颜色变蓝
input-class="font-mono" :等宽字体

'''

'''综合
添加一个带黄色垃圾箱纹饰的删除按钮的输入框:  == props(clearable
    with ui.input(value='custom clear button').classes('w-64') as i:
    ui.button(color='orange-8', on_click=lambda: i.set_value(None), icon='delete') \
        .props('flat dense').bind_visibility_from(i, 'value')


'''


from nicegui import ui
inpu=""
def change(e):
    global inpu
    inpu = e.value
    label.set_text(inpu)
input_box = ui.input(label='Enter text here',on_change=lambda e:change(e))
label = ui.label()
ui.button('提交',on_click=lambda :ui.notify(inpu))
ui.run()